<?php include 'menu.phtml'  ?>


<h1>Server </h1>
        
<form action="/user/home" method="post">
    <label for="serverip">Server Ip:</label>
    <input type="text" name="serverip" id="serverip" />
    <label for="dnsname">Dns Name:</label>
    <input type="text" name="dnsname" id="dnsname" />
    <label for="dnsname">:</label>
    <input type="text" name="dnsname" id="dnsname" />
</form>

<script type="text/javascript">

//Main jgraph Grid Code

$(document).ready(function() {
var diagram = new Diagram(
			{
			'xPosition':340, 
			'yPosition':100,
                        
			'width':900, 
			'height':500,
                        'toolbar_background_color_button' : false,
                        'toolbar_border_color_button' : false,
                        'toolbar_font_color_button' : false,
                        'toolbar_font_size_button' : false,
                        'toolbar_font_family_button' : false,
                        'toolbar_border_width_button' : false,
			'imagesPath': '../../../scripts/jgraph/images/',
			'connectionColor': '#AA0000',
                       
                        onSave: function saveddata(data){
                             alert(data);
                             //ajaxgetdata(data);
                             //send(data);
                            // open ("POST", URL, bool)
                             //send("GET",'/user/home',true);
                       // sends data to a php file, via POST, and displays the received answer
                       
                        }
                                                                         
			});
                        
                        function ajaxgetdata(data)
                        {
                            $.ajax({
		type : 'POST',
		url : '/user/home',
		contentType: "application/json",
                dataType: "text",
                data: saveddata(daata),
		//data : {
		//	'regionCodes' : selectedRegions,
		//	'itemCodes' : selectedItems,
		//	'years' : yearList,
		//	'indicator' : indicator,
		//	'element' : indicatorElement,
		//	'reportType' : chartType,
		//	'compareBy' : compareBy,
		//	'conversionFactor' : cf,
		///	'dataType' : dataType
		//},
                
		success : function(dataRecieved) {
			ajaxSuccess(dataRecieved, daata);

		},
		error : function(r, ts, e) {

			alert(e);
		}
	});

                            
                        }
                        
                       

                        
                        diagram.addNode(new Node({
			'nodeId': '1',
			'nodeType':'IMAGE',
			'nodeContent': 'Goal',
			'xPosition':200,
			'yPosition':150,
			'width': '120',
			'height' : '70',
			'bgColor':'#FFFFFF',
			'borderColor':'#AAAAAA',
			'borderWidth':'1',
			'fontColor':'#000000',
			'fontSize':'',
			'fontType':'',
			'minHeight':170,
			'maxHeight':200,
			'minWidth':200,
			'maxWidth':300,
			'nPort':true,
			'ePort':true,
			'sPort':true,
			'wPort':true,
			'image':'../../../scripts/jgraph/images/computer.png',
			'draggable':true,
			'resizable':true,
			'editable':true,
			'selectable':true,
			'deletable':true,
			'nPortMakeConnection': true,
			'ePortMakeConnection': true,
			'sPortMakeConnection': true,
			'wPortMakeConnection': true,
			'nPortAcceptConnection': true,
			'ePortAcceptConnection': true,
			'sPortAcceptConnection': true,
			'wPortAcceptConnection': true

		}));


diagram.addNode(new Node({
			'nodeId': '2',
			'nodeType':'NODE',
			'nodeContent': 'Goal',
			'xPosition':412,
			'yPosition':150,
			'width': '120',
			'height' : '70',
			'bgColor':'#FFFFFF',
			'borderColor':'#AAAAAA',
			'borderWidth':'1',
			'fontColor':'#000000',
			'fontSize':'',
			'fontType':'',
			'minHeight':50,
			'maxHeight':200,
			'minWidth':100,
			'maxWidth':200,
			'nPort':true,
			'ePort':true,
			'sPort':true,
			'wPort':true,
			'image':'',
			'draggable':true,
			'resizable':true,
			'editable':true,
			'selectable':true,
			'deletable':true,
			'nPortMakeConnection': true,
			'ePortMakeConnection': true,
			'sPortMakeConnection': true,
			'wPortMakeConnection': true,
			'nPortAcceptConnection': true,
			'ePortAcceptConnection': true,
			'sPortAcceptConnection': true,
			'wPortAcceptConnection': true

		}));


diagram.addNode(new Node({
			'nodeId': '3',
			'nodeType':'NODE',
			'nodeContent': 'Goal',
			'xPosition':600,
			'yPosition':150,
			'width': '120',
			'height' : '70',
			'bgColor':'#FFFFFF',
			'borderColor':'#AAAAAA',
			'borderWidth':'1',
			'fontColor':'#000000',
			'fontSize':'',
			'fontType':'',
			'minHeight':50,
			'maxHeight':200,
			'minWidth':100,
			'maxWidth':200,
			'nPort':true,
			'ePort':true,
			'sPort':true,
			'wPort':true,
			'image':'',
			'draggable':true,
			'resizable':true,
			'editable':true,
			'selectable':true,
			'deletable':true,
			'nPortMakeConnection': true,
			'ePortMakeConnection': true,
			'sPortMakeConnection': true,
			'wPortMakeConnection': true,
			'nPortAcceptConnection': true,
			'ePortAcceptConnection': true,
			'sPortAcceptConnection': true,
			'wPortAcceptConnection': true

		}));
                
                diagram.addConnection(new Connection('1','n','2','s','#AA0000', '1'));
diagram.addConnection(new Connection('2','n','3','s','#AA0000', '1'));
                        
                       
                      
                        




  });
</script>
 